<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>仓库管理系统</title>
    <script src="/vanilla-cream-css/js/libs/jquery-1.10.0.js"></script>
    <script src="/vanilla-cream-css/js/libs/bootstrap.min.js"></script>
    <script src="/layui/layui.js"></script>
    <link href="/vanilla-cream-css/css/bootstrap.css" rel="stylesheet"/>
    <link href="/layui/css/layui.css" rel="stylesheet"/>
    <script>
        $(function () {
           $("#addBtn").click(addBtnClick);
           $("#addProduct_btn_submit").click(addProductSubmit);
           clearAddProductModel();
        });

        function clearAddProductModel() {
            $('#addProductModel').on('hide.bs.modal', function () {
                $("#addProductId").val('');
                $("#addProductTyeId").val('');
                $("#addProductPrice").val('');
                $("#addProductGuaranteeTime").val('');
                $("#addProductName").val('');
            })
        }

        function addBtnClick() {
            var idItem=$("#addId");
            var nameItem=$("#addName");
            var id = idItem.val();
            var name = nameItem.val();
            if(name===null||name===""||id===null||id===""){
                info("编号和名称不能为空");
                return false;
            }
            idItem.val("");
            nameItem.val("");
            var data={
                "id":id,
                "name":name
            };
            $.ajax({
                url:"addType",
                type:"post",
                contentType:"application/json;charset=UTF-8",
                data:JSON.stringify(data),
                dataType:"json",
                success:addCallBack,
                error:callBackError
            });
        }

        function addProduct() {
            $("#addProductModel").modal();
        }

        function editCheck(id,name,price,guaranteeTime,typeId) {
            return !(id===null||id===""||name === null || name === "" || price === null || price === "" || guaranteeTime === null || guaranteeTime === "" || typeId === null || typeId === "");
        }

        function addProductSubmit() {
            var idItem=$("#addProductId");
            var nameItem=$("#addProductName");
            var priceItem=$("#addProductPrice");
            var guaranteeTimeItem=$("#addProductGuaranteeTime");
            var typeIdItem=$("#addProductTyeId");
            var id = idItem.val();
            var name = nameItem.val();
            var price = priceItem.val();
            var guaranteeTime = guaranteeTimeItem.val();
            var typeId = typeIdItem.val();
            if(!editCheck(id,name,price,guaranteeTime,typeId)){
                info("每一项都不能为空");
                return false;
            }
            var data={
                "id":id,
                "name":name,
                "price":price,
                "guaranteeTime":guaranteeTime,
                "typeId":typeId

            };
            $.ajax({
                url:"addProduct",
                type:"post",
                contentType:"application/json;charset=UTF-8",
                data:JSON.stringify(data),
                dataType:"json",
                success:addCallBack,
                error:callBackError
            });
        }

        function addType() {
            $("#addModel").modal();
        }

        function addCallBack(data) {
            info(data.message);
        }

        function info(content) {
            layui.use('layer', function(){
                var layer = layui.layer;
                layer.open({
                    title: '提示信息',
                    content: content
                });
            });
        }

        function callBackError() {
            layui.use('layer', function(){
                var layer = layui.layer;
                layer.open({
                    title: '提示信息',
                    content: "系统异常，请联系管理员"
                });
            });
        }
    </script>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo">产品管理</div>
        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item"><a href="/product/index">产品管理</a></li>
            <li class="layui-nav-item"><a href="">库存管理</a></li>
            <li class="layui-nav-item"><a href="/query/">查询统计</a></li>
            <li class="layui-nav-item"><a href="/admin/user/proPage">个人信息</a></li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
            <ul class="layui-nav layui-nav-tree"  lay-filter="test">
                <li class="layui-nav-item"><a href="/product/searchType">查询种类</a></li>
                <li class="layui-nav-item"><a href="/product/searchProduct">查询产品</a></li>
                <li class="layui-nav-item"><a href="#" onclick="addType()">添加种类</a></li>
                <li class="layui-nav-item"><a href="#" onclick="addProduct()">添加产品</a></li>
            </ul>
        </div>
    </div>

    <div class="layui-body">
        <div style="padding: 15px;">
        </div>
    </div>

    <div class="layui-footer">
    </div>
    <div class="modal fade" id="addModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">添加种类</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <input type="text" id="addId"  class="form-control" placeholder="请输入种类编号">
                    </div>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <input type="text" id="addName" class="form-control" placeholder="请输入种类名称">
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>取消</button>
                    <button type="button" id="addBtn" class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>确定</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="addProductModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">添加产品</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <input type="text" id="addProductId"  class="form-control" placeholder="请输入产品编号">
                    </div>
                    <div class="form-group">
                        <input type="text" id="addProductName"  class="form-control" placeholder="请输入产品名称">
                    </div>
                    <div class="form-group">
                        <input type="text" id="addProductPrice"  class="form-control" placeholder="请输入产品价格">
                    </div>
                    <div class="form-group">
                        <input type="text" id="addProductGuaranteeTime" class="form-control" placeholder="请输入产品保质期(单位:天)">
                    </div>
                    <div class="form-group">
                        <input type="text" id="addProductTyeId" class="form-control" placeholder="请输入产品类别编号">
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>取消</button>
                    <button type="button" id="addProduct_btn_submit" class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>确定</button>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>